<template>
  <div class="history-container">
    <div class="top">
      <div class="fanhui-btn" @click="handleRoute">
        <i class="el-icon-arrow-left"></i>
        <span>返回</span>
      </div>
      <div class="lujing">
        <span>当前位置：系统维护/换流站维护/状态评估维护</span>
      </div>
    </div>
    <div class="content">
      <el-tabs v-model="activeTabName" type="border-card">
        <el-tab-pane name="1" label="子模块状态维护">
          <SonModulePro :siteId="$route.query.siteId"></SonModulePro>
        </el-tab-pane>

        <el-tab-pane name="2" label="桥臂状态维护">
          <Bridge :siteId="$route.query.siteId"></Bridge>
        </el-tab-pane>

        <el-tab-pane name="3" label="子模块状态评估">
          <SonModuleEva :siteId="$route.query.siteId"></SonModuleEva>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>
<script>
import SonModuleEva from "./sonModuleEva.vue";
import SonModulePro from "./sonModulePro.vue";
import Bridge from "./bridge.vue";

export default {
  name: "Evaluate",
  props: {
    type: {
      type: String,
      default: "",
    },
  },
  components: {
    SonModuleEva,
    SonModulePro,
    Bridge,
  },
  data() {
    return {
      activeTabName: "1",
    };
  },
  destroyed() {},
  methods: {
    handleRoute() {
      this.$router.go(-1)
    },
  },
};
</script>
<style scoped lang="less">
.history-container {
  height: 100%;
  .top {
    height: 60px;
    display: flex;
    align-items: center;
    color: #fff;
    .fanhui-btn {
      cursor: pointer;
      span {
        margin-left: 5px;
      }
    }
    .lujing {
      margin-left: 50px;
    }
  }
  ::v-deep .content {
    height: calc(100% - 60px);
    .el-tabs {
      height: 100%;
      .el-tabs__content {
        height: calc(100% - 40px);
        .left-content {
          position: absolute;
          height: calc(100% - 30px);
        }
        .el-tab-pane {
          height: 100%;
        }
      }
    }
  }
}
.tab-pane-wrapper {
  height: 100%;
  //display: flex;
  //.content-right {
  //  flex: 1;
  //  height: 100%;
  //  margin-left: 20px;
  //  padding: 20px;
  //  border: 1px solid #006686;
  //  .form-search {
  //    margin-bottom: 16px;
  //    .fastTimeBtn {
  //      color: #c6d3ec;
  //      font-size: 16px;
  //      font-weight: 500;
  //      margin-right: 16px;
  //      cursor: pointer;
  //    }
  //  }
  //}
}
</style>
